<template>
  <div class="sign-in">
    <div class="login-group login-name" :class="classObject('signIn_phone')">
      <i></i>
      <input v-validate="'required|numeric'" data-vv-as="手机号码" name="signIn_phone" type="text" placeholder="请输入账号"
             v-model="name">
      <span v-show="errors.has('signIn_phone')">请输入账号</span>
    </div>
    <div class="login-group login-pwd" :class="classObject('signIn_pwd')">
      <i></i>
      <input v-validate="'required|min:6'" data-vv-as="密码" name="signIn_pwd" type="password"
             v-show="!showPwd"
             placeholder="请输入密码" v-model="pwd">
      <input type="text" placeholder="请输入密码" v-show="showPwd" v-model="pwd">
      <span v-show="errors.has('signIn_pwd')">{{ errors.first('signIn_pwd') }}</span>
      <div class="pwd-eyes" :class="{on: showPwd}" @click="showPwd = !showPwd"></div>
    </div>
    <div class="login-tool">
      <router-link :to="'/login/reset-pwd?redirect='+$route.query.redirect">忘记密码</router-link>
    </div>
    <button type="button" :disabled="loading" class="login-btn btn-blue" @click="logined"><i></i> 登录</button>
    <!--<a href="http://www.xilongfx.com/index/weixin/login?status=1" class="login-btn btn-green">微信登录</a>-->
  </div>
</template>
<script>
  export default {
    created() {
      console.log(this)
    },
    data() {
      return {
        name: '',
        pwd: '',
        showPwd: false,
        loading: false
      }
    },
    methods: {
      classObject(name) {
        return {
          'is-success': this.fields[name] ? this.fields[name].valid : false,
          'is-danger': this.errors.has(name)
        }
      },
      logined() {
        let username = this.name
        let password = this.pwd
        this.$validator.validateAll()
          .then(flag => {
            if (!flag) return
            this.loading = true
            this.$http.post('/index/beta_api/login', {username, password})
              .then(data => {
                let redirect = this.$route.query.redirect
                if (redirect) {
                  window.location.href = redirect
                } else {
                  this.$router.push({name: 'live'})
                }
              }).catch(err => {
              this.loading = false
            })
          })
      }
    }
  }
</script>
